<ion-header>
  <ion-navbar color="orange">
    <ion-title>给我推荐</ion-title>
    <ion-buttons end>
      <button ion-button icon-only>
        <ion-icon name="contact"></ion-icon>
      </button>
    </ion-buttons>
  </ion-navbar>
</ion-header>

<ion-content>
  <!--推荐任务 START-->
  <div class="floor task">
    <h5 margin-left margin-right class="ht-margin-top20 ht-margin-bottom" (click)="fold('task',task_status)">
      推荐任务 快来赚钱
      <span float-end>
        <ion-icon ios="ios-arrow-down" md="ios-arrow-down" class="text-999"></ion-icon>
      </span>
    </h5>
    <div class="item-list" *ngIf="task_status">
      <div class="ht-padding-7">
        <div padding-left padding-right class="flex flex-line-between flex-align-center item-user">
          <div class="flex flex-align-center">
            <span class="face-img">
              <img src="assets/imgs/face-holder.png" alt="" width="40">
            </span>
            <span class="name">陕西羊肉泡馍</span>
          </div>
          <div class="">
            2018-01-18 11:23
          </div>
        </div>
        <div padding-left padding-right class="flex flex-line-between break-border-bottom ht-padding-7">
          <div class="item-sn">任务编号：201701181437</div>
          <div class="item-type">有偿分享任务</div>
          <div class="item-money">赏金￥0.01/条</div>
        </div>
        <div padding-left padding-right class="flex flex-line-between ht-padding-7">
          <div>信用值：90</div>
          <div>还有10次</div>
          <div>22人查看过</div>
          <div>20人分享</div>
          <div>已完成</div>
        </div>
      </div>
      <div class="break-line"></div>
    </div>
    <div class="item-list" *ngIf="task_status">
      <div class="ht-padding-7">
        <div padding-left padding-right class="flex flex-line-between flex-align-center item-user">
          <div class="flex flex-align-center">
            <span class="face-img">
              <img src="assets/imgs/face-holder.png" alt="" width="40">
            </span>
            <span class="name">陕西羊肉泡馍</span>
          </div>
          <div class="">
            <span>2018-01-18 11:23</span>
          </div>
        </div>
        <div padding-left padding-right class="flex flex-line-between break-border-bottom ht-padding-7">
          <div class="item-sn">任务编号：201701181437</div>
          <div class="item-type">有偿分享任务</div>
          <div class="item-money">赏金￥0.01/条</div>
        </div>
        <div padding-left padding-right class="flex flex-line-between ht-padding-7">
          <span>信用值：90</span>
          <span>还有10次</span>
          <span>22人查看过</span>
          <span>20人分享</span>
          <span>已完成</span>
        </div>
      </div>
      <div class="break-line"></div>
    </div>
  </div>
  <!--推荐任务 END-->
  <!--感兴趣 START-->
  <div class="floor interested">
    <h5 margin-left margin-right class="ht-margin-top20 ht-margin-bottom" (click)="fold('interested',interested_status)">
      您可能感兴趣的信息
      <span float-end>
        <ion-icon ios="ios-arrow-down" md="ios-arrow-down" class="text-999"></ion-icon>
      </span>
    </h5>
    <div class="item-list" *ngIf="interested_status">
      <div class="ht-padding-7">
        <div padding-left padding-right class="flex flex-line-between flex-align-center">
          <div class="flex flex-align-center">
            <span class="face-img">
              <img src="assets/imgs/face-holder.png" alt="" width="40">
            </span>
            <span class="name">陕西羊肉泡馍</span>
          </div>
          <div class="flex flex-align-center">
            <span class="text-red text-bold">置顶</span>
            <span float-right margin-left>2018-01-18 11:23</span>
          </div>
        </div>
        <div padding-left padding-right class="flex flex-line-between ht-padding-7">
          <div class="item-id text-999">ID：201701181437</div>
          <div class="item-tags">
            <span class="text-tags">包吃</span>
            <span class="text-tags">想得美</span>
          </div>
        </div>
        <div padding-left padding-right class="flex flex-line-between item-pledge">
          <div class="text-orange">信用值：90</div>
          <div class="flex flex-align-center">
            <span class="badge-circle badge-enjoy">享</span>
            <span class="badge-circle badge-pledge">保</span>
            <span class="badge-circle badge-reward">赏</span>
            <span class="text-red">￥3500-5000</span>
          </div>
        </div>
        <div padding-left padding-right class="flex flex-line-between ht-padding-7">
          <div>
            <p>榆次大学城招聘一名做面师傅，这里有很长很长的要求榆次大学城招聘一名做面师傅，这里有很长很长的要求榆次大学城招聘一名做面师傅，这里有很长很长的要求</p>
            <div class="flex flex-wrap">
              <div class="pic-box">
                <img src="assets/imgs/img-holder.jpg" alt="">
              </div>
              <div class="pic-box">
                <img src="assets/imgs/img-holder.jpg" alt="">
              </div>
              <div class="pic-box">
                <img src="assets/imgs/img-holder.jpg" alt="">
              </div>
            </div>
            <div class="flex flex-line-end flex-align-center text-999">
              <span margin-right class="flex flex-align-center">
                <ion-icon name="eye" class="ht-font-22"></ion-icon>
                <span class="margin-left-5">22</span>
              </span>
              <span>
                <ion-icon name="share" class="ht-font-22"></ion-icon>
              </span>
            </div>
          </div>
        </div>
      </div>
      <div class="break-line-border"></div>
    </div>
    <div class="item-list" *ngIf="interested_status">
      <div class="ht-padding-7">
        <div padding-left padding-right class="flex flex-line-between flex-align-center">
          <div class="flex flex-align-center">
            <span class="face-img">
              <img src="assets/imgs/face-holder.png" alt="" width="40">
            </span>
            <span class="name">陕西羊肉泡馍</span>
          </div>
          <div class="flex flex-align-center">
            <span class="text-red text-bold">置顶</span>
            <span float-right margin-left>2018-01-18 11:23</span>
          </div>
        </div>
        <div padding-left padding-right class="flex flex-line-between ht-padding-7">
          <div class="item-id text-999">ID：201701181437</div>
          <div class="item-tags">
            <span class="text-tags">包吃</span>
            <span class="text-tags">想得美</span>
          </div>
        </div>
        <div padding-left padding-right class="flex flex-line-between item-pledge">
          <div class="text-orange">信用值：90</div>
          <div class="flex flex-align-center">
            <span class="badge-circle badge-enjoy">享</span>
            <span class="badge-circle badge-pledge">保</span>
            <span class="badge-circle badge-reward">赏</span>
            <span class="text-red text-bold">￥3500-5000</span>
          </div>
        </div>
        <div padding-left padding-right class="flex flex-line-between ht-padding-7">
          <div>
            <p class="margin-bottom-5">榆次大学城招聘一名做面师傅，这里有很长很长的要求榆次大学城招聘一名做面师傅，这里有很长很长的要求榆次大学城招聘一名做面师傅，这里有很长很长的要求</p>
            <div class="flex flex-wrap">
              <div class="pic-box">
                <img src="assets/imgs/img-holder.jpg" alt="">
              </div>
              <div class="pic-box">
                <img src="assets/imgs/img-holder.jpg" alt="">
              </div>
              <div class="pic-box">
                <img src="assets/imgs/img-holder.jpg" alt="">
              </div>
            </div>
            <div class="flex flex-line-end flex-align-center text-999">
              <span margin-right class="flex flex-align-center">
                <ion-icon name="eye" class="ht-font-22"></ion-icon>
                <span class="margin-left-5">22</span>
              </span>
              <span>
                <ion-icon name="share" class="ht-font-22"></ion-icon>
              </span>
            </div>
          </div>
        </div>
      </div>
      <div class="break-line-border"></div>
    </div>
  </div>
  <!--感兴趣 END-->
  <!--推送 START-->
  <div class="floor push">
    <h5 margin-left margin-right class="ht-margin-top20 ht-margin-bottom" (click)="fold('push',push_status)">
      内容推送
      <span float-end>
        <ion-icon ios="ios-arrow-down" md="ios-arrow-down" class="text-999"></ion-icon>
      </span>
    </h5>
    <div class="item-list break-border-bottom" *ngIf="push_status">
      <div padding-left padding-right class="flex ht-padding-7">
        <div class="list-pic" margin-right>
          <img src="assets/imgs/img-holder.jpg" alt="">
        </div>
        <div class="flex-1 list-content">
          <div class="list-title text-bold">
            【太原餐饮故事】点外卖？戳这里，你的私家小厨已经上线！戳这里，你的私家小厨已经上线！戳这里，你的私家小厨已经上线！戳这里，你的私家小厨已经上线！
          </div>
          <div margin-top class="flex flex-line-end flex-align-center">
            <span>5人查看</span>
            <span margin-left>11-12</span>
            <span margin-left>评论12</span>
          </div>
        </div>
      </div>
    </div>
    <div class="item-list break-border-bottom" *ngIf="push_status">
      <div padding-left padding-right class="flex ht-padding-7">
        <div class="list-pic" margin-right>
          <img src="assets/imgs/img-holder.jpg" alt="">
        </div>
        <div class="flex-1 list-content">
          <div class="list-title text-bold">
            【太原餐饮故事】点外卖？戳这里，你的私家小厨已经上线！戳这里，你的私家小厨已经上线！戳这里，你的私家小厨已经上线！戳这里，你的私家小厨已经上线！
          </div>
          <div margin-top class="flex flex-line-end flex-align-center">
            <span>5人查看</span>
            <span margin-left>11-12</span>
            <span margin-left>评论12</span>
          </div>
        </div>
      </div>
    </div>
  </div>
  <!--推送 END-->
  <!--其他 START-->
  <div class="floor other">
    <div class="item-list break-border-bottom">
      <div padding-left padding-right class="flex ht-padding-7">
        <div class="flex-1 list-content">
          <div class="text-bold">
            【太原餐饮故事】点外卖？戳这里，你厨已经上线！戳这里，你的私家小厨已经上线！
          </div>
          <div margin-top class="flex flex-line-end flex-align-center">
            <span>5人查看</span>
            <span margin-left>分享</span>
            <span margin-left>收藏</span>
          </div>
        </div>
      </div>
    </div>
  </div>
  <!--其他 END-->
</ion-content>
<ion-footer>
  <tabs [page]="'commend'"></tabs>
</ion-footer>
